<template>
    <van-list style="margin: 15px 15px 0px 15px;" v-model="loading" :finished="finished" :finished-text="finishedTxt" @load="onLoadDynamic">
        <van-steps direction="vertical" active-color="#969799" active-icon="clock-o">
            <van-step v-for="dynamic in dynamiclist" :key="dynamic.date">
                <span class="dynamicdate">{{ dynamic.date }}</span>
                <p v-html="dynamic.text"></p>
            </van-step>
        </van-steps>
    </van-list>
</template>
<script>
import Vue from 'vue'
import { Search, List, Cell, PullRefresh, Toast, Tabbar, TabbarItem, Popup, DatetimePicker, ActionSheet, Tab, Tabs, Collapse, CollapseItem, Dialog, Uploader, Rate, Icon, Form, Sticky, Image, Loading, Step, Steps } from 'vant'
import qs from 'qs'

Vue.use(Search).use(List).use(Cell).use(PullRefresh).use(Toast).use(Tabbar).use(TabbarItem).use(Popup).use(DatetimePicker).use(ActionSheet).use(Tab).use(Tabs).use(Collapse).use(CollapseItem).use(Dialog).use(Uploader).use(Rate).use(Icon).use(Form).use(Sticky).use(Image).use(Loading).use(Step).use(Steps)
export default {
    name: 'dynamic',
    data () {
        return {
            loading: false,
            finished: false,
            dynamiclist: null,
            finishedTxt: '无动态',
            page: 0,
            startline: 0
        }
    },
    props: ['bo', 'id'],
    methods: {
        onLoadDynamic () { // 动态
            this.axios({
                method: 'post',
                url: '/api/dynamic.list.do',
                data: qs.stringify({
                    page: this.page,
                    start: this.startline,
                    bo: this.bo,
                    id: this.id
                })
            }).then(res => {
                //console.log('dynamic res', res)
                if (res.data.flag === '1') {
                    Toast(res.data.des)
                    if (res.data.des && res.data.des.indexOf('登录过期') >= 0) {
                        this.loginout()
                    }
                } else if (res.data.flag === '2') {
                    this.finished = true
                } else {
                    this.dynamiclist = res.data.jsondata
                    if (res.data.jsondata.length > 0) {
                        this.finishedTxt = '已加载全部数据'
                    }
                    this.finished = true
                }
            }).catch(res => {
                this.reserror(res)
            })
        }
    }
}
</script>
<style>
.dynamicfield {
    color: orange
}

.dynamicdate {
    font-size: 16px;
}
</style>
